<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>个人资料--layui后台管理模板 2.0</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="../../component/layui/css/layui.css" media="all"/>

</head>
<body class="childrenBody">
<form class="layui-form layui-row">
    <div class="layui-row layui-col-space10">
        <div class="layui-col-md3">
            <div class="layui-card">
                <div class="layui-card-body" style="padding: 25px;text-align: center;">
                    <div class="text-center layui-text">
                        <div class="user-info-head" id="userInfoHead">
                            <img src="" id="userAvatar" width="115px" height="115px" alt="">
                        </div>
                        <h2 style="padding-top: 20px;font-size: 20px;">就眠仪式</h2>
                    </div>
                </div>
                <div style="height: 45px;border-top: 1px whitesmoke solid;text-align: center;line-height: 45px;font-size: 13.5px;">
                    <span>陕西省，西安市</span>
                </div>
            </div>
        </div>
        <div class="layui-col-md6 layui-col-xs12">
            <div class="layui-form-item">
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-block">
                    <input type="text" value="Kevin" disabled class="layui-input layui-disabled">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">用户角色</label>
                <div class="layui-input-block">
                    <input type="text" value="超级管理员" disabled class="layui-input layui-disabled">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">真实姓名</label>
                <div class="layui-input-block">
                    <input type="text" value="" placeholder="请输入真实姓名" lay-verify="required"
                           class="layui-input realName">
                </div>
            </div>
            <div class="layui-form-item" pane="">
                <label class="layui-form-label">性别</label>
                <div class="layui-input-block userSex">
                    <input type="radio" name="sex" value="男" title="男" checked="">
                    <input type="radio" name="sex" value="女" title="女">
                    <input type="radio" name="sex" value="保密" title="保密">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">手机号码</label>
                <div class="layui-input-block">
                    <input type="tel" value="" placeholder="请输入手机号码" lay-verify="phone" class="layui-input userPhone">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">出生年月</label>
                <div class="layui-input-block">
                <input type="text" id="userbirthday" value="" placeholder="yyyy-MM-dd" placeholder="请输入出生年月"  lay-verify="userBirthday" readonly
                                               class="datetimecss">
                </div>
            </div>
            <div class="layui-form-item userAddress">
                <label class="layui-form-label">家庭住址</label>
                <div class="layui-input-inline">
                    <select name="province" lay-filter="province" class="province">
                        <option value="">请选择市</option>
                    </select>
                </div>
                <div class="layui-input-inline">
                    <select name="city" lay-filter="city" disabled>
                        <option value="">请选择市</option>
                    </select>
                </div>
                <div class="layui-input-inline">
                    <select name="area" lay-filter="area" disabled>
                        <option value="">请选择县/区</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">邮箱</label>
                <div class="layui-input-block">
                    <input type="text" value="" placeholder="请输入邮箱" lay-verify="email" class="layui-input userEmail">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">自我评价</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入内容" class="layui-textarea myself"></textarea>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit="" lay-filter="changeUser">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </div>
    </div>
</form>
<script type="text/javascript" src="../../component/layui/layui.js"></script>
<script type="text/javascript" src="../../component/js/address.js"></script>
<script>
    layui.use(['jquery', 'element', 'layer', "address", 'laydate'], function () {
        var element = layui.element,
            layer = layui.layer,
            address = layui.address(),
            laydate = layui.laydate,
            $ = layui.jquery;

        let MODULE_PATH = "operate/";
        $("#userAvatar").attr("src", parent.layui.$(".layui-nav-img").attr("src"));

        window.callback = function (data) {
            layer.close(data.index);
            $("#userAvatar").attr("src", data.newAvatar);
            parent.layui.$(".layui-nav-img").attr("src", data.newAvatar);
        }
        laydate.render({
            elem: '#userbirthday'
        });
        $("#userAvatar").click(function () {
            layer.open({
                type: 2,
                title: '更换图片',
                shade: 0.1,
                area: ["900px", "500px"],
                content: MODULE_PATH + 'uploadProfile.html',
                btn: ['确定', '取消'],
                yes: function (index, layero) {
                    window['layui-layer-iframe' + index].submitForm();
                }
            });
        });
    });
</script>
</body>
</html>
